<template>
  <div class="management">
      <el-card class="box-card" shadow="naver">
        <div slot="header" class="manageTitle">
          <h3>组员管理</h3>
          <el-row :gutter="20">
            <el-col :span="3">
              <el-input placeholder="姓名" prefix-icon="el-icon-search" v-model="searchInfo.uname"> </el-input>
            </el-col>

            <el-col :span="3">
              <el-input placeholder="电话" prefix-icon="el-icon-search" v-model="searchInfo.uphone"> </el-input>
            </el-col>

            <el-col :span="3">
              <el-select v-model="searchInfo.state" placeholder="员工状态">
                <el-option
                  v-for="item in employee"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-col>

            <el-col :span="3">
              <el-select v-model="searchInfo.jobs" placeholder="岗位">
                <el-option
                  v-for="item in jobsList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-col>

             <el-col :span="3">
              <el-select v-model="searchInfo.perm" placeholder="权限">
                <el-option
                  v-for="item in permissions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-col>

            <el-col :span="3">
                <el-button type="primary" round @click="search">查询</el-button>
            </el-col>
          </el-row>
        </div>
      </el-card>

      <!--  表格部分 -->
      <tableList />
    
      
  </div>
</template>

<script>
// import DropdownMenu from '@/components/Share/DropdownMenu'
import pagination from '@/components/Pagination/index'
import tableList from './comment/tableList.vue'
// import guide  from '../guide/index.vue'

export default {
  name: 'management',
  components: { pagination, tableList },
  data() {
    return {
        currentPage: 1,
        searchInfo: {},
        employee: [
          {value: 1, label: '在职'},{value: 2, label: '离职'}
        ],
        jobsList: [
          {value: 1, label: '前端'},{value: 2, label: '后端'},{value: 3, label: '测试'}
        ],
        permissions: [
          {value: 1, label: 'admin'},{value: 2, label: 'people'}
        ],
        tableData: [{
          date: '2016-05-03',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-02',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-04',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-01',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }],
        params: {
          page: 1,
          limit: 10,
          total: 100
        }
      
    }
  },
  mounted() {
   
  },
  methods: {
    search () {
      console.log(this.searchInfo)
    },
    handleitem (type, item) {
      if (type == 'edit') {
          console.log('==修改==',item)
      } else {
          console.log('==删除==',item)
      }
    },
    handleSizeChange (e) {
        this.params.page = e.page
        this.params.limit = e.limit
        console.log(this.params)
    },

  }
}
</script>

<style lang="scss" scoped>

.box-card{
  width: 100%;
  height: 132px;
  border: none;
  // box-shadow: none;
}



</style>
